<template>
	<view class="page">
		<!-- 头部 -->
		<view class="head">
			<view class="index-title">
				首页
			</view>
			<image class="head-bg" src="../../static/index-head-bg.png" mode=""></image>
			<view class="cont">
				<!-- 定位 -->
				<view class="location">
					<view class="dingwei iconfont icondingwei" @click="location"></view>
					<view class="text" @click="location">
						重庆市沙坪坝区
					</view>
					<image class="xiajiantou" src="../../static/index-xiajiantou.png" mode=""></image>
				</view>
				<!-- 搜索 -->
				<view class="search">
					<input type="text" value="" placeholder="搜索" placeholder-class="placeholder" />
					<image src="../../static/index-search.png" mode=""></image>
				</view>
				<!-- 倒计时 -->
				<view class="countdown-share">
					<view class="countdown">
						<view class="days">
							128天
						</view>
						<view class="text">
							高考倒计时
						</view>
					</view>
					<view class="share">
						<image src="../../static/index-fenxiang.png" mode=""></image>
						<view class="text">
							分享
						</view>
					</view>
				</view>
				<view class="des">
					为梦想加油为高考冲刺 成就梦想
				</view>
			</view>
		</view>
		<!-- 公告 -->
		<view class="notice-wrap">
			<image class="notice-bg" src="../../static/notice-bg.png" mode=""></image>
			<!-- <view class="notice">
				2021年高考最新动向是假的？
			</view> -->
			<swiper class="notice" vertical="true" autoplay="true" circular="true" disable-touch="true"  duration="500"
			  interval="4000">
				<swiper-item class="notice" v-for="(item, index) in 3"  :key="index">
					2021年高考最新动向是假的？
				</swiper-item>
			</swiper>
			<view class="iconfont iconjiantou"></view>
		</view>
		<!-- 导航 -->
		<view class="nav-wrap">
			<view class="nav">
				<navigator class="item" url="../../pagesA/collegesList/collegesList" hover-class="none">
					<image src="../../static/gaoxiao.png" mode=""></image>
					<view class="text">
						高校
					</view>
				</navigator>
				<navigator class="item" url="../../pagesA/specialtyList/specialtyList" hover-class="none">
					<image src="../../static/zhuanye.png" mode=""></image>
					<view class="text">
						专业
					</view>
				</navigator>
				<navigator class="item" url="../../pagesA/shengxuelujing/shengxuelujing" hover-class="none">
					<image src="../../static/sxjl.png" mode=""></image>
					<view class="text">
						升学路径
					</view>
				</navigator>
				<navigator class="item" url="../../pagesA/shengyaguihua/shengyaguihua" hover-class="none">
					<image src="../../static/syjh.png" mode=""></image>
					<view class="text">
						生涯计划
					</view>
				</navigator>
			</view>
			<view class="nav">
				<navigator class="item" url="../../pagesA/lizhifangan/lizhifangan" hover-class="none">
					<image src="../../static/lzfa.png" mode=""></image>
					<view class="text">
						励志方案
					</view>
				</navigator>
				<navigator class="item" url="../../pagesA/zhaoshengjihua/zhaoshengjihua" hover-class="none">
					<image src="../../static/zsjh.png" mode=""></image>
					<view class="text">
						招生计划
					</view>
				</navigator>
				<navigator class="item" url="../../pagesA/baokaofangan/baokaofangan" hover-class="none">
					<image src="../../static/bkfa.png" mode=""></image>
					<view class="text">
						报考方案
					</view>
				</navigator>
				<navigator class="item" url="" hover-class="none">
					<image src="../../static/tiwen.png" mode=""></image>
					<view class="text">
						提问
					</view>
				</navigator>
			</view>
		</view>
		<!-- 智能推荐、新高考选择 -->
		<view class="recommend-select">
			<navigator class="recommend" url="../../pagesA/smartSolution/smartSolution" hover-class="none">
				<view class="lf">
					<view class="h1">
						智能推荐
					</view>
					<view class="text">
						588745人使用
					</view>
				</view>
				<view class="rt">
					<image src="../../static/index-zntj.png" mode=""></image>
				</view>
			</navigator>
			<navigator class="select" url="../../pagesA/xingaokaoxuanke/xingaokaoxuanke" hover-class="none">
				<view class="lf">
					<view class="h1">
						新高考选科
					</view>
					<view class="text">
						5887人使用
					</view>
				</view>
				<view class="rt">
					<image src="../../static/index-xgkxz.png" mode=""></image>
				</view>
			</navigator>
		</view>
		<!-- 高考月历 -->
		<view class="calendar">
			<view class="lf">
				<view class="text">
					<view class="">
						高考
					</view>
					<view class="">
						月历
					</view>
				</view>
			</view>
			<view class="md">
				<navigator url="" hover-class="none">
					<view class="title">
						2021年高考报名启动名航招飞
					</view>
					<view class="time">
						11月
					</view>
				</navigator>
			</view>
			<navigator url="../gaokaoyueli/gaokaoyueli" hover-class="none" class="rt">
				更多
			</navigator>
		</view>
		<!-- 高考资讯 -->
		<view class="information-wrap">
			<view class="title">
				<view class="lf">
					高考资讯
				</view>
				<navigator url="" hover-class="none" class="rt">更多</navigator>
			</view>
			<view class="tab-wrap">
				<view class="end-title">
					<view v-for="(item,index) in items" :key="index" :class="{on:count == index}" @click.stop="tabChange(index)">
						{{item}}
					</view>
				</view>
				<view class="tab-cont">
					<view class="information-list">
						<navigator v-for="(item,index) in 2" :key="index" url="" hover-class="none" class="item">
							<view class="lf">
								<image class="img" src="../../static/product.png" mode=""></image>
							</view>
							<view class="rt">
								<view class="title">
									2020年高考填志愿，如何选择好大学好专业？
								</view>
								<view class="time">
									2个小时前
								</view>
							</view>
						</navigator>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import utils from '@/utils/util.js'
	export default {
		data() {
			return {
				btnnum: 0,
				items: ["推荐", "艺考", "助力高考", "政策咨询", "高考头条"],
				count: "",
			}
		},
		onLoad() {

		},
		onShow() {
			let that = this;
			that.location();
		},
		methods: {
			//tab切换
			tabChange(e) {
				let that = this;
				that.count = e
				that.btnnum = e
				console.log(that.count)
			},
			// 定位
			location() {
				let that = this;
				uni.getLocation({
					type: 'wgs84',
					geocode: true, //设置该参数为true可直接获取经纬度及城市信息
					success: function(res) {
						console.log(res)
						that.addrDel = res;
					},
					fail: function() {
						uni.showToast({
							title: '获取地址失败，将导致部分功能不可用',
							icon: 'none'
						});
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import 'home.scss';
	@import '../../common/icon/iconfont.css';
</style>
